<template>
    <div>
        <van-row style="margin-top: 2rem">
            <van-col align="center" span="8" style="margin-top: 2rem">
                <van-image
                        round
                        width="5rem"
                        height="5rem"
                        fit="cover"
                        :src="userinfo.headimgurl"
                />
            </van-col>
            <van-col span="12" style="margin-top: 2rem;height:5rem;font-size: 1.5rem"><p align="left">{{userinfo.nickname}}</p></van-col>

        </van-row>
        <van-cell-group align="left" style="margin-top: 1rem;margin-bottom: 2rem">
            <van-field v-model="username" label="用户姓名" placeholder="请输入用户姓名"/>
            <van-field v-model="phoneNumber" type="digit" label="手机号码" placeholder="请输入手机号码"/>
        </van-cell-group>
        <van-button style="margin-bottom: 2rem" type="primary" @click="registerWxUser()" block>申请授权</van-button>

    </div>

</template>

<script>
    import Notify from "vant/lib/notify";
    import {postAction} from "../api/manage";

    export default {
        name: "register",
        data() {
            return {
                cs: '测试',
                username: '',
                phoneNumber: '',
                userinfo: {headimgurl:'https://img.yzcdn.cn/vant/cat.jpeg',nickname: '测试'},
                openid: window.localStorage.getItem('openid')
            }
        },
        mounted() {
            //    Notify({message: JSON.stringify(window.localStorage.getItem('userinfo')),type:'danger',duration: 15000})
            this.userinfo = JSON.parse(window.localStorage.getItem('userinfo'));
        },
        methods: {
            registerWxUser() {
                const name1 = /^[\u4e00-\u9fa5\u4dae\uE863\-a-zA-Z]{1,50}$/; //中英文1到50字内，不带数字
                const name2 = /^(\w)\1{1,}$/; //单个字母，重复字母
                const name3 = ['傻逼', '煞笔', '神经', '艳遇'];
                const name4 = /^[a-zA-Z-\s]+$/;//单个字母

                const mobilereg1 = /^1[3|5|6|7|8|9][0-9]{9}$/; // 1[356789][0-9] （后面再接8位数）
                const mobilereg2 = /^14[5|7][0-9]{8}$/; // 14[57] （后面再接8位数）
                const userName = this.username;
                const mobile = this.phoneNumber;

                if (!userName) {
                    Notify('请填写姓名。');
                    return;
                } else if (!name1.test(userName)) {
                    Notify("您输入的姓名格式不正确。");
                    return;
                } else if (name2.test(userName.toLocaleLowerCase())) {// 大写字母转小写
                    Notify("您输入的姓名格式不正确。");
                    return;
                } else if (name3.indexOf(userName) > -1) {
                    Notify("您输入的姓名格式不正确。");
                    return;
                } else if (userName.length <= 1 && name4.test(userName)) {
                    Notify("您输入的姓名格式不正确。");
                    return;
                }
                if (!mobile) {
                    Notify('请填写手机号码。');
                    return;
                } else if (!mobilereg1.test(mobile) && !mobilereg2.test(mobile)) {
                    Notify('请填写正确的手机号码。');
                    return;
                }
                const jsonData = JSON.stringify({
                    username: this.username,
                    phoneNumber: this.phoneNumber,
                    nickname: this.userinfo.nickname,
                    openid: this.openid,
                    unionid: this.userinfo.unionid
                });
                console.log(jsonData);
                this.postWxUser(jsonData);


            },
            postWxUser(openid){
                postAction('/postone',openid).then(res =>{
                    if(res){
                        Notify({message:'申请成功，请与技术团队确认数据权限',type:'success',duration:1500});
                        location.reload();
                    }
                }).catch(err =>{
                    Notify({message:err,type:'danger',duration:1500});
                })
            }
        }
    }
</script>

<style scoped>

</style>